// 编码表单 Conf
import formCreate from '@form-create/element-ui'
import type { FormRule } from '@form-create/element-ui'

export const encodeConf = (designerRef: any) => {
  return formCreate.toJson(designerRef.value.getOption())
}

// 编码表单 Fields
export const encodeFields = (designerRef: any) => {
  return formCreate.toJson(designerRef.value.getRule())
}

export const encodeValidFields = (designerRef: any) => {
  const fieldRules: FormRule[] = []
  parseFormDataRules(designerRef.value.getRule(), fieldRules)
  return formCreate.toJson(fieldRules.map((r) => {
    return {
      field: r.field! as string,
      title: r.title as string,
      type: r.type! as string,
      // @ts-ignore
      subType: r.props?.type as string,
      // @ts-ignore
      dictType: r.props?.dictType as string,  // 扩展的数据字典类型属性
      info: r.info as string,
      display: r.display as any,
      hidden: r.hidden as any,
      // @ts-ignore
      disabled: r.props?.disabled as any,
      // @ts-ignore
      required: r.$required ?? false
    }
  }))
}

// 设置表单的 Conf 和 Fields，适用 FcDesigner 场景
export const setDesignerConfAndFields = (designerRef: any, conf: string, fields: string) => {
  // @ts-ignore
  designerRef.value.setOption(formCreate.parseJson(conf))
  // @ts-ignore
  designerRef.value.setRule(formCreate.parseJson(fields))
}

// 设置表单的 Conf 和 Fields，适用 form-create 场景
export const setFormConfAndFields = (
  detailPreview: any,
  conf: string,
  fields: string,
  noBtn: boolean = false,
  tip: boolean = false,
  value?: object
) => {
  if (isRef(detailPreview)) {
    // @ts-ignore
    detailPreview = detailPreview.value
  }
  // @ts-ignore
  detailPreview.option = formCreate.parseJson(conf)
  if (noBtn) {
    detailPreview.option = { ...detailPreview.option, submitBtn: false, resetBtn: false }
  }
  // @ts-ignore
  detailPreview.rule = formCreate.parseJson(fields)
  if (tip) {
    tipRule(detailPreview.rule)
  }
  if (value) {
    // @ts-ignore
    detailPreview.value = value
  }
}

export interface FormField {
  field: string
  title: string
  type: string  // 类型，如 input、datePicker等
  subType: string // 子类型，比如input类型包含子类型number、textarea等，datePicker类型包含子类型daterange等
  dictType: string // 字典类型
  required: boolean
}

export const parseFormFields = (fields: string): FormField[] => {
  if (fields === undefined || fields === null || fields === '') {
    return []
  }

  const rules: FormRule[] = formCreate.parseJson(fields)
  if (!rules?.length) {
    return []
  }

  const fieldRules: FormRule[] = []
  parseFormDataRules(rules, fieldRules)

  return fieldRules.map((r) => {
    return {
      field: r.field! as string,
      title: r.title as string,
      type: r.type! as string,
      // @ts-ignore
      subType: r.props?.type as string,
      // @ts-ignore
      dictType: r.props?.dictType as string,  // 扩展的数据字典类型属性
      // @ts-ignore
      disabled: (r.props?.disabled ?? false) as any,
      // @ts-ignore
      required: r.$required ?? false
    }
  })
}

const data_rule_types = [
  'input',
  'inputNumber',
  'radio',
  'checkbox',
  'select',
  'switch',
  'rate',
  'timePicker',
  'slider',
  'datePicker',
  'colorPicker',
  'cascader',
  'elTransfer',
  'tree',
  'elTreeSelect',
  'Editor',
  'UploadFile',
  'UploadImg',
  'UploadImgs',
  'DictSelect',
  'UserSelect',
  'DeptSelect',
  'ApiSelect'
]

const parseFormDataRules = (rules: any[], result: any[]) => {
  if (!rules?.length) {
    return
  }
  for (const rule of rules) {
    if (!rule || !rule.type) {
      continue
    }
    if (rule.field && data_rule_types.includes(rule.type as string)) {
      result.push(rule)
    } else {
      if (rule.type === 'group' || rule.type === 'subForm') {
        parseFormDataRules(rule.props?.rule, result)
      } else if (rule.type === 'tableForm') {
        if (rule.props?.columns?.length) {
          for (const column of rule.props?.columns) {
            parseFormDataRules(column?.rule, result)
          }
        }
      } else if (rule.children?.length) {
        parseFormDataRules(rule.children, result)
      }
    }
  }
}

const tipRule = (rules: any[]) => {
  if (!rules?.length) {
    return
  }
  for (const rule of rules) {
    if (!rule || !rule.type) {
      continue
    }
    if (rule.field && data_rule_types.includes(rule.type as string)) {
      rule.info = rule.field + (rule.info ? '，' + rule.info: '')
    } else {
      if (rule.type === 'group' || rule.type === 'subForm') {
        tipRule(rule.props?.rule)
      } else if (rule.type === 'tableForm') {
        if (rule.props?.columns?.length) {
          for (const column of rule.props?.columns) {
            tipRule(column?.rule)
          }
        }
      } else if (rule.children?.length) {
        tipRule(rule.children)
      }
    }
  }
}
